import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';

import '../../res/r.dart';
import '../../widgets/animated_text_field.dart';
import '../../widgets/load_svg_widget.dart';
import 'logic.dart';

class RegisterAccountPage extends StatelessWidget {
  RegisterAccountPage({super.key});

  final RegisterAccountLogic logic = Get.put(RegisterAccountLogic());

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        decoration: BoxDecoration(
          gradient: LinearGradient(
            begin: Alignment.bottomRight,
            end: Alignment.topLeft,
            colors: [
              Color.fromRGBO(71, 59, 84, 1),
              Color.fromRGBO(171, 95, 126, 1),
            ],
          ),
        ),
        child: SingleChildScrollView(
          child: SizedBox(
            height: 1.sh,
            child: Column(
              children: [
                SizedBox(height: 100.h),
                Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    LoadSvgWidget(
                      R.icLogo,
                      width: 100.w,
                      height: 100.h,
                    ),
                    SizedBox(height: 20.h),
                    Text(
                      "注册新账号",
                      style: TextStyle(
                        fontSize: 20.sp,
                        color: Colors.orange,
                        fontWeight: FontWeight.bold,
                      ),
                    ),
                  ],
                ),
                SizedBox(height: 60.h),
                Padding(
                  padding: EdgeInsets.symmetric(horizontal: 30.w),
                  child: Form(
                    key: logic.formKey,
                    child: Column(
                      children: [
                        AnimatedTextField(
                          controller: logic.emailController,
                          hintText: '请输入邮箱',
                          prefixIcon: Padding(
                            padding: EdgeInsets.only(right: 10.w),
                            child: Icon(Icons.email_outlined),
                          ),
                          focusedLineColor: Colors.blue,
                          width: 265.w,
                        ),
                        SizedBox(height: 10.h),
                        AnimatedTextField(
                          controller: logic.accountController,
                          hintText: '请输入账号',
                          prefixIcon: Padding(
                            padding: EdgeInsets.only(right: 10.w),
                            child: Icon(Icons.person_outline),
                          ),
                          focusedLineColor: Colors.blue,
                          width: 265.w,
                        ),
                        SizedBox(height: 10.h),
                        AnimatedTextField(
                          controller: logic.passwordController,
                          hintText: '请输入密码',
                          prefixIcon: Padding(
                            padding: EdgeInsets.only(right: 10.w),
                            child: Icon(Icons.lock_outline),
                          ),
                          focusedLineColor: Colors.blue,
                          obscureText: true,
                          width: 265.w,
                        ),
                        SizedBox(height: 10.h),
                        AnimatedTextField(
                          controller: logic.confirmPasswordController,
                          hintText: '确认密码',
                          prefixIcon: Padding(
                            padding: EdgeInsets.only(right: 10.w),
                            child: Icon(Icons.lock_reset),
                          ),
                          focusedLineColor: Colors.blue,
                          obscureText: true,
                          width: 265.w,
                        ),
                        SizedBox(height: 30.h),
                        ElevatedButton(
                          onPressed: () {
                            logic.handleRegistration();
                          },
                          style: ElevatedButton.styleFrom(
                            backgroundColor: Colors.white,
                            padding: EdgeInsets.symmetric(
                                horizontal: 40.w, vertical: 12.h),
                            shape: RoundedRectangleBorder(
                              borderRadius: BorderRadius.circular(25.r),
                            ),
                            splashFactory: NoSplash.splashFactory,
                            shadowColor: Colors.transparent,
                          ),
                          child: Row(
                            mainAxisSize: MainAxisSize.min,
                            children: [
                              LoadSvgWidget(
                                R.icThumbprint,
                                width: 24.w,
                                height: 24.h,
                              ),
                              SizedBox(width: 8.w),
                              Text(
                                "立即注册",
                                style: TextStyle(
                                  fontSize: 16.sp,
                                  color: Colors.black,
                                ),
                              ),
                            ],
                          ),
                        ),
                      ],
                    ),
                  ),
                ),
                Expanded(
                  child: Align(
                    alignment: Alignment.bottomRight,
                    child: Padding(
                      padding: EdgeInsets.only(right: 20.w, bottom: 20.h),
                      child: TextButton(
                        onPressed: () {
                          Get.back();
                        },
                        style: TextButton.styleFrom(
                          splashFactory: NoSplash.splashFactory,
                          foregroundColor: Colors.transparent,
                        ),
                        child: Text(
                          "已有账号？去登录",
                          style: TextStyle(
                            color: Colors.blue,
                            fontSize: 14.sp,
                          ),
                        ),
                      ),
                    ),
                  ),
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}